@charset "utf-8";
@import "reset";
*{
    margin: 0;
    padding: 0;
}
html,body{
    width: 100%;
    overflow-x:hidden;
}
.WebPage{
    width: 100%;
}
.logo{
    display: flex;
    align-items: center;
    >img{
        width: 100%;
    }
}
.daohang{
    border-radius:0 !important;
    margin-bottom: 0 !important;
    border: 0px !important;
}
.lunbo{
    position: initial !important;
    >div{
        >img{
            width: 100%;
        }
    }
}
.Content-top{
    box-sizing: border-box;
    padding: 3vw 12vw;
    margin: 0;
    background: #fafaf7;
    border-bottom: 1px solid #eaeaee;
}
.Content-top-left{
    >h1{
        font-size: 48px;
        color: #0078d7;
    }
    >h2{
        font-size: 28px;
        font-weight:0;
        margin: 2vw 0;
    }
    >div{
        margin: 0;
        >div{
            >div{
                margin-top: 36px;
                display: flex;
                align-items: flex-start;
                >div{
                    >img{
                        width: 64px;
                        height: 64px;
                    }
                    >h3{
                        font-size: 16px !important;
                        margin-bottom:1vw;
                        margin-left: 1vw;
                        font-weight: bold;
                    }
                    >p{
                        color: #666666;
                        font-size: 12px !important;
                        line-height: 22px;
                        margin-left: 1vw;
                    }
                }
            }
        }
    }
}
.Content-top-right{
    >img{
        width: 100%;
    }
}
.Content-center{
    box-sizing: border-box;
    padding: 3vw 12vw;
    margin: 0;
}
.Content-center-left{
    padding-top: 5vw;
    >img{
        width: 100%;
    }
}
.Content-center-right{
    >h1{
        font-size: 48px;
        color: #8fc31f;
        margin-bottom: 3vw;
    }
    >div{
        display: flex;
        align-items: center;
        >p{
            font-size: 14px;
            color: #959595;
        }
        div{
            margin: 7px 10px;
            >img{
                width: 54px;
                height: 54px;
            }
        }
    }
}
.Content-jiazhu{
    margin: 0px;
    box-sizing: border-box;
    padding: 7vw 16vw;
    background: #0079d7;
    text-align: center;
    >h1{
        font-size: 48px;
        color:white;
        font-weight: 100;
    }
    >div{
        text-align: left;
        margin-top: 65px;
        display: flex;
        justify-content: space-between;
        >div:nth-of-type(1){
            width: 66px;
            height: 66px;
            >img{
                width: 66px;
                height: 66px;
            }
        }
        >div:nth-of-type(2){
            margin-left: 60px;
            >h3{
                font-size: 33px;
                color: white;
                margin-bottom: 6px;
            }
            >p{
                color: #fffefe;
                font-size: 14px;
            }
        }
    }
}
.Content-buttom{
    box-sizing: border-box;
    padding: 3vw 12vw;
    margin: 0;
}
.Content-buttom-top{
    display: flex;
    justify-content: space-between;
    align-items: center;
    >h3{
        font-size: 35px;
    }
    >p{
        font-size: 14px;
    }
}
.Content-buttom-buttom{
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items:flex-start;
    >div:nth-of-type(1){
        position: relative;
        padding: 0;
        margin: 0;
        margin-top: 48px;
        margin-bottom: 20px;
        height: 200px;
        >video{
            background: black;
            position: absolute;
            top: 0;
            left: 0;
            width:100%;
            height: 100%;
        }
        >div{
            position: absolute;
            top: 0;
            left: 0;
            width:100%;
            height: 100%;
            >img{
                width:100%;
                height: 100%;
            }
        }
    }
    >div:nth-of-type(2){
        padding: 0;
        margin: 0;
        margin-top: 48px;
        >div{
            margin-bottom: 30px;
            text-align: center;
            >img{
                width: 67px;
                height: 67px;
            }
        }
    }
}
.footer-top{
    box-sizing: border-box;
    padding: 3vw 12vw;
    margin: 0;
    background: #f4f4f4;
    >p{
        font-size: 30px;
        >span{
            font-size: 11px;
        }
    }
    >div{
        margin: 0;
        padding: 0;
        >div{
            text-align: center;
            padding: 0;
            margin-top: 20px;
        }
    }
}
.footer-buttom{
    box-sizing: border-box;
    width: 100%;
    height: 8vw;
    margin: 0;
    padding: 0;
    background-color: #3b3b3b;
    padding:3vw 12vw;
    >div:nth-of-type(1){
        >ul>li{
            display: inline-block;
            color: #a1a3ab;
            font-size: 14px;
            margin-right: 10px;
        }
        >p{
            color: #a1a3ab;
            font-size: 12px;
        }
    }
    >div:nth-of-type(2){
        display: flex;
        justify-content: space-between;
        >div{
            width: 38px;
            height: 38px;
            border-radius:19px ;
            background: #d8d8e0;
            color:#4c4c52;
            font-size: 28px;
            text-align: center;
            position: relative;
            >div{
                position: absolute;
                width: 120px;
                height: 125px;
                top: -130px;
                left: -40px;
                overflow: hidden;
                >img{
                    width: 120px;
                    height: 125px;
                }
            }
        }
    }
}
@media only screen and (min-width:768px){
    .daohang{
        border-radius:0 !important;
        min-width: 1100px;
        padding: 0 12vw ;
        box-sizing: border-box;
    }
    .WebPage{
        min-width: 1100px;
    }
}
@media only screen and (max-width:768px){
    .Content-top{
        padding: 7vw;
    }
    .Content-top-left>h1{
        font-size: 30px;
        color: #0078d7;
    }
    .Content-top-left>h2{
        font-size: 15px;
        font-weight: 100;
    }
    .Content-center-right{
        >h1{
            font-size: 30px;
        }
    }
    .Content-buttom-top{
        >h3{
            font-size: 18px;
        }
    }
    .Content-buttom{
        padding: 7vw 3vw;
    }
    .Content-buttom-buttom{
        width: 100%;
        >div:nth-of-type(1){
            margin-top:20px;
            margin-bottom: 20px;
            width: 100%;
            >img{
                width:100%;
            }
            >video{
                width:100%;
            }
        }
        >div:nth-of-type(2){
            padding: 0;
            margin: 0;
            >div{
                margin-bottom: 10px;
                text-align: center;
                width: 33.3333333333%;
                >img{
                    width: 67px;
                    height: 67px;
                }
            }
        }
    }
    .Content-jiazhu{
        padding: 7vw 0vw;
        >h1{
            font-size: 28px;
        }
        >div{
            text-align: center;
            display: block;
            margin-top: 50px;
            >div{
                margin: 0 auto;
            }
            >div:nth-of-type(2){
                margin-left: 0px;
                margin-top: 20px;
                >h3{
                    font-size: 20px;
                    color: white;
                    margin-bottom: 6px;
                }
                >p{
                    color: #fffefe;
                    font-size: 10px;
                    line-height: 30px;
                }
            }
        }
    }
    .pianyi{
        margin-left: 16.66666667% !important;
    }
    .footer-top{
        padding: 14vw 5vw;
        >div{
            >div{
                >img{
                    width: 100%;
                }
            }
        }
    }
    .footer-buttom{
        height: 50vw;
        >div{
            margin-top:8px;
            >ul{
                text-align: center;
            }
        }
    }
}